<template>
  <view class="u-m-t-20 u-p-x-30 bg-white" >
  	<view class="u-p-b-10 u-p-t-20 font-weight-bold">{{item.merch_name}}</view>
  	<block v-for="(v,indey) in item.goods_list" :key="indey">
  		<goods-order-goods-item :item="v"></goods-order-goods-item>
  	</block>
  	<view class="flex align-center u-p-y-10 u-border-bottom">
  		<u-form ref="uForm" class="flex-1">
  			<u-form-item labelWidth="120" label="买家留言" :borderBottom="false">
  				<u-input class="flex-1" v-model="obj.note" placeholder="建议留言前先与商家沟通确认（50字内）" type="textarea"
  				placeholderStyle="font-size: 24rpx; color: #999" maxlength="50" @input="change"/>
  			</u-form-item>
  		</u-form>
  	</view>
  	<view class="">
  		<u-cell-item title="商品金额" :value="'¥ ' + item.merch_total_price" :arrow="false" hoverClass="none"></u-cell-item>
  		<u-cell-item title="运费" :value="'¥ '+ item.merch_express_price" :arrow="false" hoverClass="none"></u-cell-item>
  		<u-cell-item title="优惠劵" v-if="is_special !=1" :value="item.coupon_list.length? specialMoney? specialMoney: '有可用' : '无可用' " 
  		             hoverClass="none" @click="coupupClick(item.coupon_list)"></u-cell-item>
  		<u-cell-item title="满减金额" v-if="is_special !=1" :value="'¥ '+ item.merch_manjian_price" :arrow="false" hoverClass="none"></u-cell-item>
  		<u-cell-item title="实付金额" :value="'¥ '+ item.merch_pay_price" :arrow="false" hoverClass="none"></u-cell-item>
  	</view>
		<u-popup v-model="show" mode="bottom" height="50%" safe-area-inset-bottom borderRadius="10">
			<view class="border" style="height: 100%;">
				<goods-order-coupupPopup ref="goodsOrderCoupupPopup" @click="sueCoupup"></goods-order-coupupPopup>
			</view>
		</u-popup>
  </view>
</template>

<script>
  export default {
    name: "goods-order-item",
    props: {
			index: {
				type: [String, Number],
				default: 0
			},
    	item: {
    		type: Object,
    		default() {
    			return {goods_list:[]}
    		}
    	},
			is_special: {
				type: [String, Number],
				default: 0
			}
    },
		data() {
			return {
				show: false,
				specialMoney: '',
				obj: {
					note: '',  // 备注
					merch_id: '', // 店铺id
					id: '' // 优惠劵id
				},
			}
		},
    methods: {
      // 打开优惠劵
      coupupClick(list) {
      	if(!list.length) return
      	this.show = true
      	this.$nextTick(()=>{
					list.forEach(v=> {
						if(this.obj.id == v.id) {
							v.checked = true
						}else {
							v.checked = false
						}
					})
      		this.$refs.goodsOrderCoupupPopup.list = JSON.parse(JSON.stringify(list))
      	})
      },
			sueCoupup(e) {
				this.show = false
				this.specialMoney = e.money
				this.obj = {...this.obj, ...e, index:this.index}
				this.$emit('coupupSure', this.obj)
			},
      change(e) {
        this.obj = {...this.obj,index:this.index}
        this.$emit('coupupSure', this.obj)
      }
    }
  }
</script>

<style lang="scss" scoped>
</style>
